<template>
	<div>
	<top-nav bgColor="white" title="批量下单详情"  btnName="btn"  :rightShow="false"  returnPath="上一级" ></top-nav>
	<div style="width: 100%;height: 3rem;"></div>
		<section style="text-align: left;width: 100%;height: 23rem;padding: 0 1.5rem;position: relative;border-bottom: 1px solid gainsboro;">

			<section class="title">
				<label style="flex: 2;">账户编号：</label>
				<span style="flex: 7;text-align: left;">		{{data.BillNo}}</span>
			</section>
			<section class="title">
				<label style="flex: 2;">客户姓名：</label>
				<span style="flex: 7;text-align: left;">		{{data.CustomName}}</span>
			</section>
						<section class="title">
				<label style="flex: 2;">产&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;品：</label>
				<span style="flex: 7;text-align: left;">		{{data.CustomName}}</span>
			</section>
			<section class="title">
				<label style="flex: 2;">已&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;发：</label>
				<span style="flex: 7;text-align: left;">		{{data.CustomName}}</span>
			</section>
			<section class="title">
				<label style="flex: 2;">创建时间：</label>
				<span style="flex: 7;text-align: left;">		{{data.CustomName}}</span>
			</section>
			<section class="title">
				<label style="flex: 2;">开始时间：</label>
				<span style="flex: 7;text-align: left;">		{{data.CustomName}}</span>
			</section>
			<section class="title">
				<label style="flex: 2;">结束时间：</label>
				<span style="flex: 7;text-align: left;">		{{data.CustomName}}</span>
			</section>
			
<!--			{{data}}-->
						<!--<section class="title">
				<label style="flex: 2;">客户姓名：</label>
				<span style="flex: 7;text-align: left;">		{{CustomName}}</span>
			</section>
						<section class="title">
				<label style="flex: 2;">客户姓名：</label>
				<span style="flex: 7;text-align: left;">		{{CustomName}}</span>-->
			</section>
	</section>
	<section>
			<section class="table-title" >
		    	<span>车牌号</span>
		    	<span>数量</span>
		    	<span>授权码</span>
		    	<span>操作</span>
		    </section>
		    <section v-for="(item,index) in carList"
		    	 class="table-tr" 
		    	 :class="tableIndex==index?'choice-table-tr':''">
		    	<span >{{item.Number}}</span>
		    	<span >{{item.Total}}</span>
		    	<span >{{item.Card}}</span>
		    	<section class="Unbundling" >
					  发送
				</section>
		    </section>
	</section>
	

	</div>
</template>

<script>
	 import TopNav from '@/components/nav/topNav.vue'
	  export default {
		components: {
		      TopNav
		},
		data(){
			return{
//			ID:'123',
//			BillNo:'',
//			CustomName:'',
//			CustomID:'',
//			CustomNumber:'',
//			Time:''{},
			carList:[
			{
				Number:'鲁A12345',
				Total:'60吨',
				Card:123456
			}
			],
			data:{}
		
			}
		},
		mounted(){
			this.ID=this.$route.params.ID
//			this.BillNo=this.$route.params.BillNo
//			this.CustomName=this.$route.params.CustomName
//			this.CustomID=this.$route.params.CustomID
//			this.CustomNumber=this.$route.params.CustomNumber
//			this.Time=this.$route.params.Time
			this.data=this.$route.params.data
		
		},
		methods:{
				getAllSalesCarByorder(){
				let that=this
				that.axios.post('/demo/getAllSalesCarByorder',{
					'factoryId':this.$parent.factoryId,
					'uid':this.$parent.factoryInfo.UID,
					'currentpage':'1',
					'assid':that.$route.params.assid,
					'itemid':that.$route.params.itemid,
					'customerid':that.$route.params.customerid,
					'organizeid':that.$route.params.organizeid,
					'orderid':that.$route.params.orderid
					
					
				}).then(function(response){
					that.list=response.data.data.list
					console.info(response.data.data.list)
				}).catch(function(error){
					
				})
				}
	 		}
		}
</script>

<style scoped>
.Unbundling{
  	 width: 20%;
  	 height: 2rem;
  	 border-radius: 3px;
  	 display: flex;
  	 align-items: right;
  	 justify-content: right;
  	 background-color: #f56c6c;
  	 color:white
  }
.left-Grant{
		flex: 2;
	}
	.right-mu-input{
		flex: 10;
		margin-top: 0.6rem;
	}
	.input-add{
		width: 100%;
		display: flex;
		justify-content: left;
		align-items: center;
		height: 2.8rem;
		flex-direction: row;
	}
	.title{
		border-bottom: 1px solid #e5e5e5;
		width: 100%;
		display: flex;
		justify-content: left;
		align-items: center;
		height: 2.8rem;
	}
	
	.choiceBtn{
		position: absolute;
		bottom: 1rem;
		right: 1rem;
		width: 4.6rem;
		background-color: #0090FF;
		display: flex;
		justify-content: center;
		align-items: center;
		height: 1.6rem;
		color: white;
		font-size: 0.7rem;
		border-radius: 3px;
	}
	.choice-list{
		width: 100%;
		height: 100%;
		margin-top: 0.6rem;
	}
	.choice-sec{
		display: flex;
		flex-direction: column;
		height: 100%;
		justify-content: left;
		width: 100%;
		border: 1px solid #e5e5e5;
		border-radius: 4px;
		margin-top: 0.6rem;
	}
	.show-sec{
		display: flex;
		flex-direction: column;
		justify-content: left;
		width: 100%;
		border: 1px solid #e5e5e5;
		border-radius: 4px;
		margin-top: 0.6rem;
	}
	.show-sec span{
		text-align:left;
		height:2rem;
		text-indent: 0.6rem;
		line-height: 2rem;
	}
	.choice-bg{
		background: #e5e5e5;
	}
	.choice-sec span{
		text-align: left;
		font-size: 0.8rem;
		text-indent: 0.6rem;
		height:2rem;
		line-height: 2rem;
	}
	.show-list{
		display: flex;
		flex-direction: column;
		height: 100%;
		justify-content: left;
		width: 100%;
		/*border: 1px solid #e5e5e5;*/
		margin-top: 1.6rem;
	}
	.show-list span{
		text-align: left;
		font-size: 0.8rem;
		text-indent: 1rem;
		height:2rem;
		line-height: 2rem;
	}
	.show-sec-input{
		height: 2rem;
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: center; 
		margin-bottom: 0.6rem;
		padding-right: 0.6rem;
	}
	.height-show{
		height: 2rem;
		line-height: 2rem;
	}
	.mu-text-field{
		font-size: 0.8rem!important;
	}
	.table-title{
		color: rgb(0, 144, 255);
		font-size: 0.9rem;
	}
	.table-title,.table-tr{
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: center;
		height: 2.4rem;
		border-bottom: 1px solid rgba(234,234,234,.8);
		
	}
	.table-tr{
		font-size: 0.8rem;
	}
	.choice-table-tr{
		background-color: rgba(234,234,234,.5);
	}
	.table-title span:nth-child(1),.table-tr span:nth-child(1){
		flex: 1.5;
	}
	.table-title span:nth-child(2),.table-tr span:nth-child(2){
		flex: 1;
	}
	.table-title span:nth-child(3),.table-tr span:nth-child(3){
		flex: 1;
	}
</style>